<%@page import="com.sinodata.bsm.common.vo.RealTimeViewConf"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@page import="net.sf.json.JSONArray"%>
<%@page import="net.sf.json.JSONObject"%>

<%
    request.setAttribute("flashPath", request.getContextPath()+ "/resources/flash");

%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html style="overflow:hidden;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>实时性能图</title>
<%@ include file="../include/common.jsp"%>
	<%@ include file="../include/jbox.jsp"%>
<!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
<!-- BEGIN Browser History required section -->
<link rel="stylesheet" type="text/css"
	href="${flashPath}/history/history.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/style/default/bsm/perf/real-time-view-custom.css" />
<link rel="stylesheet" media="all" type="text/css"
	href="${pageContext.request.contextPath}/style/default/tree/zTreeStyle.css" />
<link type="text/css"
	href="${pageContext.request.contextPath}/style/default/jqueryui/smoothness/jquery-ui-1.8.21.custom.css"
	rel="Stylesheet" />
<script type="text/javascript" src="${flashPath}/history/history.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/tree/jquery.ztree.all-3.1.min.js"></script>
<script
	src="${pageContext.request.contextPath}/js/jquery/ui/jquery.ui.core.js"></script>
<script
	src="${pageContext.request.contextPath}/js/jquery/ui/jquery.ui.widget.js"></script>
<script
	src="${pageContext.request.contextPath}/js/jquery/ui/jquery.ui.mouse.js"></script>
<script
	src="${pageContext.request.contextPath}/js/jquery/ui/jquery.ui.selectable.js"></script>

<!-- END Browser History required section -->
<script type="text/javascript" src="${flashPath}/swfobject.js"></script>
<script type="text/javascript">
	// For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. 
	var swfVersionStr = "0.0.0";
	// To use express install, set to playerProductInstall.swf, otherwise the empty string. 
	var xiSwfUrlStr = "${flashPath}/playerProductInstall.swf";
	var flashvars = {};
	flashvars.flashPath = "${flashPath}";
	flashvars.reqPath = "${pageContext.request.contextPath}"
	flashvars.viewId ="0";
	var params = {};
	params.quality = "high";
	params.bgcolor = "#ffffff";
	params.allowscriptaccess = "sameDomain";
	params.allowfullscreen = "true";
	params.wmode = "transparent";
	var attributes = {};
	attributes.id = "RealTimeCustom";
	attributes.name = "RealTimeCustom";
	attributes.align = "middle";
	swfobject.embedSWF("${flashPath}/RealTimeCustom.swf", "flashContent",
			"100%", "100%", swfVersionStr, xiSwfUrlStr, flashvars, params,
			attributes);
	// JavaScript enabled so display the flashContent div in case it is not replaced with a swf object.
	//   swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>
<script type="text/javascript">
	function changeId(cId) {
		RealTimeCustom.displayView(cId);
	}

	function isChanged() {
		
		var ret = false;
		try{
			RealTimeCustom.isChanged();
			}catch(e){
				alert(e.description);
			}
		return ret;
	}

	function openAddWindow(){
		$.jBox.open("html:"+$('#addNewDiv').clone(true).html()+"",'新增性能图',300,'auto',{buttons:''});	
	}

	function openDelWindow(){
		$.jBox.open("html:"+$('#delConfirmDiv').clone(true).html()+"",'删除确认',300,'auto',{buttons:''});	
	}
	
	function scroll_down() {
		$("#selectable").animate({
			"top" : "-=50px"
		}, "fast");
	}

	function scroll_up() {
		if ($("#selectable").css('top') > '-50px') {
			$("#selectable").css('top', '0px');
		} else {
			$("#selectable").animate({
				"top" : "+=50px"
			}, "fast");
		}
	}

	$(document).ready(function() {
		$("#selectable").selectable();
		$("#selectable").bind("selectableselected", function(event, ui) {
			if (isChanged()) {
				$(ui.selected).removeClass('ui-selected');
				event.stopPropagation();
				return false;
			}
			var cid = $(ui.selected).attr("id");
			if(cid != undefined){
				changeId(cid);
			}
		});

		$("#selectable").bind("selectableunselected", function(event, ui) {
			if (isChanged()) {
				getTopWin(window).getMessageBox().tip("请先保存或取消", '性能图已修改');
				$(ui.unselected).addClass('ui-selected');
				event.stopPropagation();
				return false;
			}
		});

		initCustomList();
	});

	function initCustomList(){
		var selectable = $('#selectable');
		selectable.html("");
		$.ajax({
			type:'post',
			url:'real-time-view!freeCustomList.action',
			global:false,
			async:false,
			cache:false,
			dataType:'json',
			success:function(data,textStatus){
				var selectable = $('#selectable');
				for(var i=0;i<data.length;i++){
					var ob = data[i];
					selectable.append("<li class='ui-widget-content' id='"+ob.id+"'  >"+ob.name+"</li>");
				}
			//	$(selectable.children[0]).attr("class"," ui-selectee");
			},
			error:function(){
				getTopWin(window).getMessageBox().alert('服务器内部错误,请联系管理员','错误');
			}
		});
	}

	function toAdd(){
		$.jBox.close();
		$.ajax({
			type:'post',
			url:'real-time-view!saveCustom.action',
			data:{name:"新增性能图"},
			global:false,
			async:false,
			cache:false,
			dataType:'json',
			success:function(data,textStatus){
				if(data.id!=null&&data.id!=""){
					getTopWin(window).getMessageBox().tip('添加成功','success');
					initCustomList();
				}else{
					getTopWin(window).getMessageBox().tip('添加失败','info');
				}
			},
			error:function(){
				getTopWin(window).getMessageBox().alert('服务器内部错误,请联系管理员','错误');
			}
		});

	}

	function toDel(){
		$.jBox.close();
		var delId = $('#selectable li.ui-selected').attr("id");
		$.ajax({
			type:'post',
			url:'real-time-view!delCustom.action',
			data:{cid:delId},
			global:false,
			async:false,
			cache:false,
			dataType:'json',
			success:function(data,textStatus){
				if(data.id!=null&&data.id!=""){
					initCustomList();
				}else{
					getTopWin(window).getMessageBox().tip('删除失败','info');
				}
			},
			error:function(){
				getTopWin(window).getMessageBox().alert('服务器内部错误,请联系管理员','错误');
			}
		});

	}
</script>
</head>
<body class="over-h">
       <div style="width: 100%; height:100%">
		<div style="width:15%;vertical-align: top; height:100%; float:left">
			<div id="leftDiv" class="visitor_cp">
				<div class="mod_t_play">
					<h2 class="title-h2">
						<span>性能图定义</span>
								<div id="div1" class="add" onclick="openAddWindow();">	  </div>
								<div id="div2" class="del" onclick="openDelWindow()">	  </div>
					</h2>
				</div>
				<div style="height: 100%; overflow: hidden;">
					<ul id="selectable"></ul>
				</div>
			</div>
		</div>
		<div style="height:100%; width:85%; float:left;">
			<div id="flashContent" class="flashContent">
				<p>To view this page ensure that Adobe Flash Player version
					11.3.0 or greater is installed.</p>
				<script type="text/javascript">
					var pageHost = ((document.location.protocol == "https:") ? "https://"
							: "http://");
					document
							.write("<a href='http://www.adobe.com/go/getflashplayer'>Get Adobe Flash player</a>");
				</script>
			</div>
		</div>
	</div>
	<div id="addNewDiv" style="display: none;">
  	    <div style="padding:10px;" >
	  		<span>性能图名：</span>
	  		<span>
	  			<input type="text" id="nameTI">
	  		</span>
	  		<div style="height:20px;text-align:right;margin-top:5px;">
	  			<input type="button" value="确定" class="btn-4" onclick="toAdd();" />
	  		</div>
	  	</div>
  	</div>
  	<div id="delConfirmDiv" style="display: none;">
  	    <div style="padding:10px;" >
	  		<span>确定删除所选性能图</span>
	  		<div style="height:20px;text-align:right;margin-top:5px;">
	  			<input type="button" value="确定" class="btn-4" onclick="toDel();" />
	  		</div>
	  	</div>
  	</div>
</body>
</html>